<template>
	<el-dialog :visible.sync="options.showDialog" width="1200px" class="evalDialog">
		<h3 class="payrollDetail-title">查看明细</h3>
		<comTable :options="options.tableData"></comTable>
		<div class="flip">
			<el-pagination
				@current-change="handleCurrentChange"
				@size-change="handleSizeChange"
				:total="options.totalnum"
				:page-sizes="[10, 20, 30, 50, 100]"
				:current-page="pageNum"
				:page-size="pageSize"
				layout="total, sizes, prev, pager, next, jumper"
				background
			></el-pagination>
		</div>
	</el-dialog>
</template>

<script>

export default{
	components: {
		comTable: () => import("@/household/common/comTable.vue"),
	},
	props:{
		options:{
			type: Object,
			require: true
		}
	},
	data(){
		return {
			pageNum: 1,
			pageSize: 10
		}
	},
	methods:{
		
		/* 跳转到第几页 */
		handleCurrentChange(val){
			this.pageNum = val;
			this.$emit('changePageNum',val)
		},
		/* 每页显示多少条数据 */
		handleSizeChange(val){
			this.pageSize = val;
			this.$emit('changePageSize',val);
		}
	},
}
</script>

<style scoped="scoped">
.payrollDetail-title{text-align: center;padding: 30px 0 10px;font-size: 24px;}
.flip{text-align: center;padding: 20px 0;}
</style>
